<style lang="less">
    @import '../../styles/common.less';
    @import '../../styles/table.less';
</style>

<template>
    <div>
        <Row class="margin-top-10">
            <Col span="24">
                <Card>
                    <p slot="title">
                        <Icon type="ios-keypad"></Icon> 分割列表
                    </p>
                    <p style="height: 15px;"></p>
                    <div>
                        <div>
                            <Table stripe :columns="columns" :data="rows" border></Table>
                        </div>
                    </div>
                </Card>
            </Col>
        </Row>
    </div>
</template>

<script>
export default {
    name: 'getList',
    components: {
        // canEditTable //组件名称，需要import
    },
    data () {
        return {
            rows: [],
            columns: [
                {
                    title: 'ID',
                    align: 'center',
                    key: 'part_id',
                    width: 80,
                }, {
                    title: '图片',
                    align: 'center',
                    key: 'name',
                    width: 150,
                    render: (h, params) => {
                        return h('img', {
                            attrs : {src : params.row.cover_img+'?x-oss-process=image/resize,h_50', style: 'margin:5px;'}
                        });
                    }
                }, {
                    title: '品名',
                    align: 'center',
                    key: 'name',
                    width: 100,
                }, {
                    title: '销售单价',
                    align: 'center',
                    key: 'price',
                    width: 80,
                    render: (h, params) => {
                        return params.row.price/100
                    }
                }, {
                    title: '预售单价',
                    align: 'center',
                    key: 'pre_price',
                    width: 80,
                    render: (h, params) => {
                        return params.row.pre_price/100
                    }
                }, {
                    title: '估计重量(kg)',
                    align: 'center',
                    key: 'pre_weight',
                    width: 80,
                }, {
                    title: '预付款',
                    align: 'center',
                    key: 'pre_pay',
                    width: 80,
                    render: (h, params) => {
                        return params.row.pre_pay/100
                    }
                },

                {
                    title: '操作',
                    key: 'action',
                    width: 200,
                    align: 'center',
                    render: (h, params) => {
                        return h('div', [
                            h('Button', {
                                props: {type: 'primary', size: 'small'},
                                style: {marginRight: '5px'},
                                on: {
                                    click: () => {
                                        this.edit(params.index)
                                    }
                                }
                            }, '编辑'),
                            h('Poptip', {
                                props: {confirm: true, title: '您确定要删除这条数据吗?', transfer: true},
                                on: {
                                    'on-ok': () => {
                                        this.remove(params.index);
                                    }
                                }
                            }, [
                                h('Button', {
                                    props: {type: 'error', size: 'small'}
                                }, '删除')
                            ]),
                        ]);
                    }
                }
            ],
        };
    },
    methods: {
        getList() {
            this.$http.post('admin/pig/partList', this.$qs.stringify()).then((res) => {
                var d = res.data;
                if (d.code == 0) {
                    this.rows = d.data;
                } else {
                    this.$Notice.error({
                        title: 'Error Warning',
                        desc: `Error：${d.msg}<br>`
                    });
                }
            })
        },
        edit (index) {

        },
        remove (index) {
            this.rows.splice(index, 1);
        },
    },
    created () {
        this.getList();
    }
};
</script>
